// 全局样式
.theme-container
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif

// 暗黑模式样式
html.dark
  --background-color: #1a1a1a
  --text-color: #f5f5f5
  --border-color: #363636
  --code-bg-color: #2d2d2d
  --accent-color: #3eaf7c
  
  body
    background-color: var(--background-color)
    color: var(--text-color)
  
  .navbar,
  .sidebar
    background-color: var(--background-color)
    border-color: var(--border-color)
  
  .navbar .links,
  .sidebar-links
    color: var(--text-color)
  
  .search-box input
    background-color: #2d2d2d
    color: var(--text-color)
    border: 1px solid var(--border-color)
  
  .content code
    background-color: var(--code-bg-color)
    color: #f5f5f5
  
  .custom-block.tip
    background-color: rgba(62, 175, 124, 0.1)
    border-color: var(--accent-color)
  
  .custom-block.warning
    background-color: rgba(235, 189, 52, 0.1)
    border-color: #e7c000
  
  .custom-block.danger
    background-color: rgba(192, 0, 0, 0.1)
    border-color: #c00
  
  a
    color: #58a6ff

  // 代码块样式
  div[class*="language-"]
    background-color: #2d2d2d
    
  // 表格样式
  table
    border-color: var(--border-color)
    
    tr
      border-top: 1px solid var(--border-color)
      
      &:nth-child(2n)
        background-color: #2d2d2d
    
    th, td
      border: 1px solid var(--border-color)

// 动画
.fade-enter-active, .fade-leave-active
  transition: opacity .5s

.fade-enter, .fade-leave-to
  opacity: 0 